<script>

import Content from "./content"

export default {
    name:'Tabs',
    data(){
        return{
            containers:[]
        }
    },
    props:{
        currentIndex:{
            type:[String,Number],
            default:1
        }
    },
    methods:{
        onChangeHandler(index){
            this.$emit("changeCurrentIndex",index);
        }
    },
    render(){
        return(
            <div>
                <ul class="tabs-header">
                    { this.$slots.default }
                </ul>
                <Content containers={this.containers}/>
            </div>
        )
    }
}
</script>
<style >

.tabs-header {
  display:flex;
  position: fixed;
  list-style: none;
  width: 100%;
  overflow: hidden;
  margin: 0;
  padding: 0;
  z-index: 999;
  background: #000;
}

</style>
